﻿
@{
    ViewBag.Title = "PerformanceAssessCheck";
    Layout = "~/Views/Shared/_LayoutMain.cshtml";
}

@section css{
    <link rel="stylesheet" href="~/assets/portal/assets/css/common.css" />
    <link rel="stylesheet" href="~/bussiness/js/base/reset.css" />
    <style>
        .ooo table {
            width: 100%;
            border-collapse: collapse; /*关键代码*/
            border-spacing: 0;
        }
        .ant-select-arrow, .ant-select-clear {
            position: absolute;
            right: 10px;
        }
        .ooo td {
            border-bottom: 1px solid #333;
            border-right: 1px solid #333;
            text-align: center
        }

        .iTitle {
            font-weight: 600;
            font-size: 16px;
            display: flex;
            width: 100%;
            align-items: center;
            margin-left: 20px;
        }

            .iTitle::before {
                content: "";
                margin-right: 10px;
                display: inline-block;
                width: 4px;
                height: 20px;
                background: #0064e5;
            }
    </style>
}
<div id="PerformanceAssessCheck" class="font-['SourceHanSansSC']">
    <a-style-provider hash-priority="high">
        <a-config-provider :locale="vlocale">
            <a-image :width="200"
                     :style="{ display: 'none',zIndex:100 }"
                     :preview="{visible:PerformanceAssessCheckParams.previewShow.value,onVisibleChange:PerformanceAssessCheckParams.setVisible}" :src="PerformanceAssessCheckParams.imgUrl.value"></a-image>
            <a-modal v-model:open="PerformanceAssessCheckParams.fileOpen.value" width="60%" title="附件详情" v-on:ok="PerformanceAssessCheckParams.fileOpen.value=false">
                <div style="padding:30px;box-sizing:border-box">
                    <template v-if="PerformanceAssessCheckParams.chooseFiles.value&&PerformanceAssessCheckParams.chooseFiles.value.length!=0">
                        <div v-for="e in PerformanceAssessCheckParams.chooseFiles.value" style="cursor:pointer; display:flex;margin:10px 0;font-size:15px; align-items:center;width:100%;justify-content:space-between">{{e.name}} <div style="display:flex; align-items:center">    <a-space><img style="width: 20px; height: 22px " src="~/Bussiness/img/svg/preview.svg" v-on:click="PerformanceAssessCheckParams.btnPreview(e.uid)" /><img style="width: 20px; height: 22px " v-on:click="PerformanceAssessCheckParams.btnDownLoad(e.uid) " src="~/Bussiness/img/svg/download.svg" /><img style="width: 20px; height: 22px " v-if="false" v-on:click="PerformanceAssessCheckParams.btnDelete(e.uid)" src="~/Bussiness/img/svg/delete.svg" /></a-space></div> </div>
                    </template>
                    <template v-else>
                        暂无附件
                    </template>


                </div>
            </a-modal>

            <header class="px-5 box-border">

                <div class="flex items-center">
                    <div class="w-full h-[48px] text-[13px]  rounded-lg mx-auto my-[10px]  bg-white  text-[#888888] text-3xl flex items-center px-10">   <div class="w-22 h-22 bg-blue-200 mr-5"> <img class="w-full h-full cursor-pointer" v-on:click="PerformanceAssessCheckParams.vvback()" src="~/Assets/nimgs/exit.png" alt="返回" /></div> <span class="text-[]">首页<span class="mx-2">/</span>履职考核<span class="mx-2">/</span><span class="text-[#424758] text-[15px]">月度考核填报</span> </span>  </div>
                </div>




                <div class=" w-full">
                    <a-collapse class="w-full" expand-icon-position="end" v-model:active-key="PerformanceAssessCheckParams.activeKey.value">
                        <a-collapse-panel key="0" header="月度考核填报">

                            <a-form :model="PerformanceAssessCheckParams.mform.value"
                                    name="basic"
                                    :label-col="{ span: 4 }"
                                    :wrapper-col="{ span: 20 }"
                                    autocomplete="off">

                                <div class="mt-10">
                                    <a-row>

                                        <a-col :span="10">
                                            <a-form-item label="考核月份">

                                                <a-select allow-clear
                                                          :disabled="PerformanceAssessCheckParams.isEdit.value"
                                                          placeholder="请选择考核月份"
                                                          v-model:value="PerformanceAssessCheckParams.mform.value.month"
                                                          :options="PerformanceAssessCheckParams.monthList.value"></a-select>


                                            </a-form-item>
                                        </a-col>
                                        <a-col :span="2"></a-col>
                                        <a-col :span="10">
                                            <a-form-item label="考评总分">
                                                <a-input placeholder="暂无数据" disabled :value="(Math.floor(+PerformanceAssessCheckParams.TotalScore.value * Math.pow(10, 2)) / Math.pow(10, 2)).toFixed(2)" />
                                            </a-form-item>
                                        </a-col>
                                    </a-row>
                                    <a-row>

                                        <a-col :span="10">




                                            <a-form-item label="部门">

                                                <a-select allow-clear
                                                          show-search
                                                          :filter-option="PerformanceAssessCheckParams.filterOption"
                                                          :disabled="PerformanceAssessCheckParams.isEdit.value"
                                                          placeholder="请选择部门"
                                                          v-on:change="PerformanceAssessCheckParams.dChange"
                                                          v-model:value="PerformanceAssessCheckParams.mform.value.dept"
                                                          :options="PerformanceAssessCheckParams.deptList.value"></a-select>


                                            </a-form-item>
                                        </a-col>
                                        <a-col :span="2"></a-col>
                                        <a-col :span="10">
                                            <a-form-item label="部门负责人">
                                                <a-input placeholder="请选择部门" disabled v-model:value="PerformanceAssessCheckParams.mform.value.duty" />
                                            </a-form-item>
                                        </a-col>

                                    </a-row>

                                    <a-row>

                                        <a-col :span="10">
                                            <a-form-item label="扣分系数">
                                                <a-input placeholder="请选择部门" disabled v-model:value="PerformanceAssessCheckParams.mform.value.rate" />
                                            </a-form-item>
                                        </a-col>
                                        <a-col :span="2"></a-col>
                                        <a-col :span="10">
                                            <a-form-item label="办公性质">
                                                <a-input placeholder="请选择部门" disabled v-model:value="PerformanceAssessCheckParams.mform.value.type" />
                                            </a-form-item>
                                        </a-col>

                                    </a-row>





                                </div>
                            </a-form>

                        </a-collapse-panel>
                        <a-collapse-panel key="1" header="月度考核表">



                            <template v-if="PerformanceAssessCheckParams.mform.value.dept">

                                <a-card>
                                    <template #title>
                                        <div class="w-full flex justify-between items-center">
                                            <div class="flex items-center"> <div>{{PerformanceAssessCheckParams.listInfo.value.TypeName}}</div> </div>
                                        </div>
                                    </template>
                                    <div class="ooo  w-full h-auto my-0 bg-white overflow-scroll">
                                        <div style="border-top: 1px solid #333;  border-left: 1px solid #333">
                                            <table v-for="(e,i) in PerformanceAssessCheckParams.mlist.value">
                                                <tr v-if="i==0">
                                                    <td class="w-[30px] h-[38px]">一级指标</td>
                                                    <td class="w-[500px] h-[38px]">
                                                        <div class="flex" style="height:100%">
                                                            <div style="height: 100%; flex: 1; display: flex; align-items: center; justify-content: center; border-right: 1px solid #333; ">二级指标</div>

                                                            <div style="height: 100%; flex: 1; display: flex; align-items: center; justify-content: center; border-right: 1px solid #333; ">计算方式</div>
                                                            <div style="height: 100%; flex: 1; display: flex; align-items: center; justify-content: center; border-right: 1px solid #333; ">分数</div>
                                                            <div style="height: 100%; flex: 1; display: flex; align-items: center; justify-content: center; border-right: 1px solid #333; ">考评情况</div>
                                                            <div style="height: 100%; flex: 1; display: flex; align-items: center; justify-content: center; border-right: 1px solid #333; ">审核人</div>
                                                            @*<div style="height: 100%; flex: 1; display: flex; align-items: center; justify-content: center; border-right: 1px solid #333; ">操作</div>*@
                                                        </div>
                                                    </td>
                                                </tr>

                                                <tr v-for="(es,ei) in e.NodeList">

                                                    <td class="w-[30px]" v-if="ei==0" :rowspan="e.NodeList.length">{{e.No}}.{{e.CategoryName}}({{e.Score}}分)</td>

                                                    <td class="w-[500px] h-[108px]">
                                                        <div class="flex" style="height: 100%;">
                                                            <div style="flex: 1; border-right: 1px solid #333; display: flex; align-items: center; justify-content: center; padding: 0 4px; box-sizing: border-box">{{es.SubcategoryName}}({{es.Score}}分)</div>

                                                            <div style="flex: 1; border-right: 1px solid #333; display: flex; align-items: center; justify-content: center; padding:0 4px; box-sizing: border-box " :style="{color:es.ItemScore!==0?'red':'black',fontWeight:'600'}">{{es.CalcType==0?'扣分':'加分'}}</div>

                                                            <div style="flex: 1; border-right: 1px solid #333; position: relative; display: flex; align-items: center; justify-content: center; padding: 0 4px; box-sizing: border-box ">
                                                                <div style=" flex: 1; overflow: hidden;  display: flex; align-items: center; justify-content: center; padding: 0 4px; box-sizing: border-box ">
                                                                    <div style="width:100%;height:100%;display:flex;align-items:center;justify-content:center;position:absolute;left:0">
                                                                        <a-input-number :disabled="PerformanceAssessCheckParams.isEdit.value" v-model:value="es.ItemScore" v-on:change="PerformanceAssessCheckParams.ichange" :min="0" :max="100" :formatter="value => `${value}分`" :parser="value => value.replace('分', '')"></a-input-number>

                                                                    </div>
                                                                </div>

                                                            </div>
                                                            <div style="flex: 1; border-right: 1px solid #333; display: flex; align-items: center;flex-direction:column; justify-content: center; padding:0 4px; box-sizing: border-box ">
                                                                <a-textarea :disabled="PerformanceAssessCheckParams.isEdit.value" v-model:value="es.Remark"></a-textarea>
                                                                <div style="display:flex;align-items:center">
                                                                    <a-upload :show-upload-list="false" v-model:file-list="es.ItemFileList"
                                                                              v-on:change="PerformanceAssessCheckParams.handleChange">
                                                                        <a-button v-if="!PerformanceAssessCheckParams.isEdit.value" style="margin-top:8px" v-on:click="PerformanceAssessCheckParams.upload(i,ei)" type="primary">上传</a-button>

                                                                    </a-upload>

                                                                    <a-button v-on:click="PerformanceAssessCheckParams.handleFile(i,ei)" style="margin-top:8px;margin-left:4px" type="primary">查看 <span v-if="es.ItemFileList&&es.ItemFileList.length!=0">({{es.ItemFileList&&es.ItemFileList.length}})</span> </a-button>
                                                                </div>
                                                            </div>

                                                            @*<div style="flex: 1; border-right: 1px solid #333; display: flex; align-items: center; justify-content: center; padding:0 4px; box-sizing: border-box ">{{es.UpdateUserName||'-'}}</div>
                                                                <div style="flex: 1; border-right: 1px solid #333; display: flex; align-items: center;flex-direction:column; justify-content: center; padding:0 4px; box-sizing: border-box ">
                                                                    <a-button style="background: #29aefa " v-on:click="PerformanceAssessCheckParams.handleItemSave(es,ei)" style="margin-top:8px;margin-left:4px" type="primary">保存</a-button>
                                                                </div>*@
                                                            <div style="flex: 1; border-right: 1px solid #333; display: flex; align-items: center; justify-content: center; padding:0 4px; box-sizing: border-box ">{{es.UpdateUserName||'-'}}</div>


                                                        </div>
                                                    </td>
                                                </tr>

                                            </table>


                                        </div>








                                    </div>
                                </a-card>
                                <div class="w-full mt-10 h-[46px] bg-[#f6f8f8] flex items-center">
                                    <div class="iTitle">备注及附件</div>

                                </div>


                                <a-form :model="PerformanceAssessCheckParams.subform.value"
                                        :label-col="{ span: 1 }"
                                        :wrapper-col="{ span: 8 }"
                                        autocomplete="off">

                                    <div class="mt-10">
                                        <a-row>
                                            <a-col :span="24">
                                                <a-form-item label="备注"
                                                             name="Remark">

                                                    <a-textarea :disabled="PerformanceAssessCheckParams.isEdit.value" v-model:value="PerformanceAssessCheckParams.subform.value.Remark" placeholder=""></a-textarea>
                                                </a-form-item>
                                            </a-col>

                                        </a-row>
                                        <a-row>
                                            <a-col :span="24">
                                                <a-form-item label="附件">
                                                    <a-upload-dragger :disabled="PerformanceAssessCheckParams.isEdit.value" v-model:file-list="PerformanceAssessCheckParams.fileList.value"
                                                                      :item-render="PerformanceAssessCheckParams.itemRender.value"
                                                                      :custom-request="()=>{}"
                                                                      v-on:change="PerformanceAssessCheckParams.handleChange1">

                                                        <p class="ant-upload-text">单击或拖动文件到此区域进行上传</p>
                                                        <p class="ant-upload-hint">
                                                            支持单个或批量上传
                                                        </p>
                                                    </a-upload-dragger>
                                                </a-form-item>
                                            </a-col>
                                        </a-row>
                                    </div>
                                </a-form>










                                <div class="w-full h-[56px] items-center flex justify-end">
                                    <div class="mr-[70px] text-[16px] font-weight-bold flex items-center">总分：<span style="font-size: 25px; font-weight: bold; color: #FF5E13; ">{{(Math.floor(PerformanceAssessCheckParams.TotalScore.value * Math.pow(10, 2)) / Math.pow(10, 2)).toFixed(2)}}</span><div style="margin-left:6px"> 分</div></div>
                                </div>
                            </template>
                            <template v-else>
                                <div style="width:100%;height:100px;display:flex;align-items:center;justify-content:center;">
                                    <h2>请先选择部门</h2>

                                </div>


                            </template>




                        </a-collapse-panel>
                        <a-collapse-panel key="2" header="审核信息">

                            <a-form :model="PerformanceAssessCheckParams.cform.value"
                                    :label-col="{ span: 4 }"
                                    :wrapper-col="{ span: 20 }"
                                    autocomplete="off">

                                <div class="mt-10">
                                    <a-row>

                                        <a-col :span="10">
                                            <a-form-item label="提交人">

                                                <a-input placeholder="暂无数据" disabled v-model:value="PerformanceAssessCheckParams.cform.value.subperson" />
                                                 

                                            </a-form-item>
                                        </a-col>
                                        <a-col :span="2"></a-col>
                                        <a-col :span="10">
                                            <a-form-item label="提交日期">
                                                <a-input placeholder="暂无数据" disabled :value="PerformanceAssessCheckParams.cform.value.subdate" />
                                            </a-form-item>
                                        </a-col>
                                    </a-row>
                                    <a-row>

                                        <a-col :span="10">




                                            <a-form-item label="审核人">
                                                <a-input placeholder="暂无数据" disabled :value="PerformanceAssessCheckParams.cform.value.checkperson" />


                                            </a-form-item>
                                        </a-col>
                                        <a-col :span="2"></a-col>
                                        <a-col :span="10">
                                            <a-form-item label="审核日期">
                                                <a-input placeholder="暂无数据" disabled :value="PerformanceAssessCheckParams.cform.value.checkdate" />
                                            </a-form-item>
                                        </a-col>

                                    </a-row>

                                    <a-row>

                                        <a-col :span="10">
                                            <a-form-item label="意见">
                                                <a-textarea v-model:value="PerformanceAssessCheckParams.cform.value.Remark" placeholder="请输入意见"></a-textarea>
                                            </a-form-item>
                                        </a-col>
                                        <a-col :span="2"></a-col>
                                        <a-col :span="10">

                                        </a-col>

                                    </a-row>





                                </div>
                            </a-form>






                        </a-collapse-panel>

                    </a-collapse>
                    <m-bottom-btns></m-bottom-btns>

                    <div id="msg_end" style="height:0px; overflow:hidden"></div>
                </div>
            </header>
        </a-config-provider>
        </a-style-provider>
</div>

@section Js{
    <script src="~/bussiness/js/base/tailwind.js"></script>
    <script type="module">
        import Composition from '../../bussiness/js/pg/Performance/assessCheck.js?v=@DateTime.Now.ToString("yyyyMMddHHmmss")'
        import localeValues from '../../Bussiness/js/base/es/locale/zh_CN.js'
        singalApp('PerformanceAssessCheck', Composition, localeValues)
    </script>
}



